<template>
	<div>
		<el-dialog :visible.sync="dialogVisible" :append-to-body="true" :close-on-click-modal="false" title="站内链接" width="900px" @close="close">
			<el-row v-if="dialogVisible" :gutter="20">
				<el-col :span="4">
					<el-menu :default-active="form.insideParams.insidePageType" @select="handleMenuSelect">
						<el-menu-item v-for="item in insideLinkPageTypeOptions" :key="item.key" :index="item.key">{{ item.label }}</el-menu-item>
					</el-menu>
				</el-col>
				<el-col :span="20">
					<div class="right-container">
						<!-- 我的页面 -->
						<div v-if="form.insideParams.insidePageType === 'MYPAGE'" class="my-page-box"><MyPage :row="form" @selectInsideLink="selectInsideLink" /></div>

						<!-- 系统页面 -->
						<div v-if="form.insideParams.insidePageType === 'SYSTEMPAGE'" class="system-page-box"><SystemPage :row="form" @selectInsideLink="selectInsideLink" /></div>

						<!-- 商品详情 -->
						<div v-if="form.insideParams.insidePageType === 'GOODSDETAIL'" class="goods-detail-box"><GoodsList :row="form" @selectInsideLink="selectInsideLink" /></div>
						<!-- 券列表 -->
						<div v-if="form.insideParams.insidePageType === 'COUPON'" class="coupon-box"><CouponList :row="form" @selectInsideLink="selectInsideLink" /></div>
						<!-- 商城店铺 -->
						<div v-if="form.insideParams.insidePageType === 'SHOPMALL'" class="mall-box"><ShopMallList :row="form" @selectInsideLink="selectInsideLink" /></div>
						<!-- 积分商品 -->
						<div v-if="form.insideParams.insidePageType === 'POINTGOODSDETAIL'" class="goods-detail-box">
							<PointGoodsList :row="form" @selectInsideLink="selectInsideLink" />
						</div>
					</div>
				</el-col>
			</el-row>
			<div slot="footer" class="dialog-footer">
				<el-button size="small" round @click="hide">取 消</el-button>
				<el-button size="small" round type="primary" @click="submit">确 定</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
import wxaBuildConfig from '@/views/wxaBuildModule/config';
import MyPage from './components/MyPage';
import SystemPage from './components/SystemPage';
import GoodsList from './components/GoodsList';
import CouponList from './components/CouponList';
import ShopMallList from './components/ShopMallList';
import PointGoodsList from './components/PointGoodsList';

export default {
	components: {
		MyPage,
		SystemPage,
		GoodsList,
		CouponList,
		ShopMallList,
		PointGoodsList
	},
	data() {
		return {
			// 配置
			insideLinkPageTypeOptions: [],
			resolve: null,
			reject: null,
			// 状态
			dialogVisible: null,
			// 数据
			classifyCode: 'DEFAULT',
			form: {
				insideParams: {
					insidePageType: 'MYPAGE',
					commonCode: null,
					pageId: null,
					goodsSerial: null,
					remark: null
				}
			}
		};
	},

	methods: {
		/**
		 * 弹框相关
		 */
		open({ row }) {
			// 侧边栏
			this.insideLinkPageTypeOptions = wxaBuildConfig[this.classifyCode].insideLinkPageType;
			// 初始化数据
			const defaultForm = JSON.parse(JSON.stringify(row));
			if (!defaultForm.insideParams) {
				defaultForm.insideParams = {
					insidePageType: 'MYPAGE',
					commonCode: null,
					pageId: null,
					goodsSerial: null,
					remark: null
				};
			}
			defaultForm.insideParams.insidePageType = defaultForm.insideParams.insidePageType || 'MYPAGE';
			defaultForm.insideParams.commonCode = defaultForm.insideParams.commonCode || null;
			this.form = defaultForm;
			this.show();
			return new Promise((resolve, reject) => {
				this.resolve = resolve;
				this.reject = reject;
			});
		},

		show() {
			this.dialogVisible = true;
		},

		close() {
			// Object.assign(this.$data, this.$options.data())
			this.form = {
				insideParams: {
					insidePageType: 'MYPAGE',
					commonCode: null,
					pageId: null,
					goodsSerial: null,
					remark: null
				}
			};
		},

		hide() {
			this.resolve = null;
			this.reject = null;
			this.dialogVisible = false;
		},

		/**
		 * 数据组
		 */

		/**
		 * 按钮组
		 */
		// 选择菜单
		handleMenuSelect(key, keyPath) {
			this.form.insideParams.insidePageType = key;
		},

		// 选择链接回调
		selectInsideLink(data) {
			this.form.insidePage = data.params.insidePage;
			this.form.insideParams.pageId = data.params.insideParams.pageId || null;
			this.form.insideParams.goodsSerial = data.params.insideParams.goodsSerial || null;
			this.form.insideParams.commonCode = data.params.insideParams.commonCode || null;
			this.form.insideParams.remark = data.params.insideParams.remark || null;
			this.form.mode = data.params.mode;
			this.form.path = data.params.path;
		},

		// 确 定
		submit() {
			this.resolve && this.resolve(this.form);
			this.hide();
		}

		/**
		 * 状态组
		 */

		/**
		 * 方法组
		 */
	}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/* 右侧容器 */
.right-container {
	max-height: 700px;
	overflow: auto;
}
</style>
